<template>
  <div class="hello">
   
  </div>
</template>

<script lang="ts" setup>
import { ref, reactive, computed, defineProps, Ref } from 'vue'

const props = defineProps<{
  title: string,
  value?: number
}>()

console.log(props);

// const emit = defineEmits<{
//   (e: 'uodate', value: number)
// }>()

interface todo {
  title: string,
  done: boolean
}

let todos: Ref<todo[]> = ref([{title: 'Xuexi', done: false}]) // 声明一个ref数据

interface 面向字节编程 {
  name: string,
  time: number
}


const count = ref(1)

const msg = ref('') // 根据输入的参数自行推导出字符类型
const mag1 = ref<string>('') // 通过泛型显示约束

const obj = reactive({})
const course = reactive<面向字节编程>({name: '玩转vue3', time: 30})

const msg2 = computed(() => '')
const course2 = computed<面向字节编程>(() => {
  return {name: '123', time: 30}
})
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
